<template>
	<!-- 合格投资者认证 -->
	<view class="qualified_pages">
		<view class="box">
			<view class="row">
				<view class="left">
					姓名
				</view>
				<input type="text" v-model="userName" disabled="false" placeholder="请输入用户名" />
			</view>
			
			<!-- <singleSelect :pickerSingleJson="idtypeArr" v-bind:message="parentMsg">
				证件类型
			</singleSelect> -->
			<view class="row">
				<view class="left">
					证件类型
				</view>
				<input type="text" v-model="idcardType" disabled="false" placeholder="请输入证件类型" />
			</view>
			<view class="row">
				<view class="left">
					证件号码
				</view>
				<input type="text" v-model="idcardNum" value="" disabled="false"  placeholder="请输入您的证件号码" />
			</view>
			
			<view class="row">
				<view class="left">
					手机号码
				</view>
				<input type="text" value="" v-model="phoneNum" disabled="false" placeholder="请输入您的手机号码" />
			</view>
			
			<singleSelect :pickerSingleJson="proveTypeArr" v-on:listenToshimingrenzheng="getProveData">
				证明类型
			</singleSelect>
			
			<view class="row">
				<view class="left">
					证明金额
				</view>
				<input type="text" value="" v-model="money" /><span class="unit">元</span>
			</view>
			<p class="txt">上传证明资料</p>
			<addImage @click="showImg"></addImage>
		</view>
		<view class="questionBox">
			<view class="question"  @click="toSimufengxianceping">
				提交
			</view>
		</view>
	</view>
</template>

<script>
	import mpvuePicker from '../../../../../../components/mpvue-picker/mpvuePicker.vue';
	import cityData from '../../../../../../common/city.data.js';
	import mpvueCityPicker from '../../../../../../components/mpvue-citypicker/mpvueCityPicker.vue';
	import addImage from '../../../../../API/image/image.vue';
	import singleSelect from '../../../../../API/common/singleSelect';
	import global_ from '../../../../../../components/tool/RenZhengGlobal';
	export default {
		components:{
			mpvuePicker,
			mpvueCityPicker,
			addImage,
			singleSelect
		},
		data() {
			return {
				url:global_.api.HEGETOUZIZHERENZHENG_GET,
				themeColor: '#007AFF',
				mode: '',
				deepLength: 1,
				cityPickerValueDefault: [0, 0, 1],
				idtypeArr:[],
				proveTypeArr:[],
				pickerText:'',
				textValue: '',
				objList: [{
						label: '中国',
						value: 1
					},
					{
						label: '俄罗斯',
						value: 2
					},
					{
						label: '美国',
						value: 3
					},
					{
						label: '日本',
						value: 4
					}
				],
				pickerValueDefault: [0],
				pickerValueArray:[],
				singleValueArray:[],
				mulLinkageTwoPicker: cityData,
				customerInfo:{},
				imageList:[],
				customerId:'' ,//页面id
				userName:'',
				idcardType:'',  //证件类型
				idcardNum:'',   // 证件号码
				phoneNum:'' ,  //电话号码
				zhengmingValue:''    ,// 证明类型val
				money:''
			};
		},
		onLoad:function(){
			this.customerInfo.customerName=uni.getStorageSync("customerInfo");
			this.customerId=uni.getStorageSync("customerId");
			// console.log("customerInfo========================="+JSON.stringify(customerInfo));
			this.getData();
			console.log('拿到页面id==========='+this.customerId);
			// 拿到实名认证页面的   证件类型数据
			this.idtypeArr = JSON.parse(uni.getStorageSync('idtypeArr1'));
			console.log('接收到的数据============='+JSON.parse(uni.getStorageSync('idtypeArr1')));
		},
		methods: {
			getProveData(data){
				console.log('拿到证明类型'+data[1]);
				this.zhengmingValue = data[0];
			},
			getData(){
				uni.request({
					method:'get',
					url:this.url,
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					data:{
						cCustNo: this.customerId
					},
					dataType:'json',
					success:(res)=>{
						var result1 = res.data.data.zhengMingType;
						console.log(result1);
						var obj = JSON.parse(JSON.stringify(result1));
						for(var i =0;i<obj.length;i++){
							this.proveTypeArr[i] = obj[i];  // 遍历证明类型
						}
						
						var result = res.data.data.userInfo;
						console.log(result);
						this.userName = result.userName;
						this.idcardType = result.cardType;
						this.idcardNum = result.cardNo;
						this.phoneNum = result.mobile;
					},
					fail:(error)=>{
						console.log(error);
					},
					complete:()=>{
						
					},
				})
			},
			onCancel(e) {
				console.log(e)
			},
			onConfirm(e) {
				this.pickerText = e.label;
			},
			toSimufengxianceping() {     // 提交按钮 
			
			console.log('id======'+this.customerId+'证明的value======='+this.zhengmingValue+'钱========'+this.money);
			console.log('证明类型的val'+this.zhengmingValue);
				uni.request({
					method:'post',
					url:global_.api.ZHUANYETOUZIZHERENZHENG_SAVE,
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					data:{
						custNo: this.customerId,
						zhengMingType: this.zhengmingValue,        // 需要传入  value
						money:this.money
					},
					dataType:'json',
					success:(res)=>{
						console.log(res);
						uni.showToast({
							title: res.data.message,
							icon: 'none',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						if(res.data.message == '成功'){
							uni.navigateTo({
								url:'../../../../../my/lcs-wodekehu/kehuxiangqing/kehuxiangqing'
							})
						}
						
					},
					fail:(error)=>{
						console.log(error);
					},
					complete:()=>{
						
					}
				})
			},
			showSinglePicker(){
				this.singleValueArray = this.objList
				this.mode = 'selector'
				this.deepLength = 1
				this.pickerValueDefault = [0]
				this.$refs.mpvuePicker.show()
			},
			textChange(evt) {
				console.log(123);
				console.log(this.textValue);
				// this.idCardArray = this.idcardData;
				//console.log(this.textValue);
				// this.textValue = evt.target.label;
				// console.log('-------------'+idCardArray);
				
			},
			bindPickerChange: function(e) {
				//console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
				this.oper_Id = this.array[this.index];
			},
			showMulLinkageTwoPicker() {   // 两列
				this.pickerValueArray = this.mulLinkageTwoPicker
				this.mode = 'multiLinkageSelector'
				this.deepLength = 2
				this.pickerValueDefault = [0, 0]
				this.$refs.mpvuePicker.show()
			},
			showImg(e){
				console.info("所选择的图片：》》》》》》》"+e.imageList);
				this.imageList = e.imageList;
			}
		}
	}
</script>

<style>
	.qualified_pages{
		font-size: 15px;
	}
	page {
		background: rgb(255, 255, 255);
	}


	.box {
		padding: 0 30upx;
	}

	.shiming {
		background: #f5f5f5;
		line-height: 70upx;
		height: 70upx;
		text-indent: 20upx;
		color: rgba(153, 153, 153, 1);
		font-size: 12px;
	}

	.row {
		height: 98upx;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.row input {
		flex: 3;
	}

	.left {
		font-size: 15px;
		margin-right: 20px;
		flex: 1;
	}

	.questionBox {
		display: flex;
		flex-direction: row;
		justify-content: center;
		width: 100%;
		padding: 40upx 0;
		text-align: center;


	}

	.question {
		width: 100%;
		margin:0 15px;
		height: 70upx;
		background: linear-gradient(-90deg, rgba(196, 156, 90, 1) 0%, rgba(226, 196, 138, 1) 100%);
		border-radius: 35px;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		color: rgb(255, 255, 255);

	}
	.unit{
		padding-right: 10px;
	}
	.icon {
		margin-right: 10upx;
	}

	.radio-box {
		width: 100%;
		text-align: left;
		display: flex;
		flex-direction: row;
		align-items: center;
		height: 100upx;

	}

	.radio {
		display: flex;
		flex-direction: row;
		align-items: center;
		font-weight: 500;
		color: rgba(153, 153, 153, 1);

	}

	.radio image {
		height: 16px;
		width: 16px;
		margin-right: 10upx;

	}
	.txt{
		padding-top: 10px;
	}
</style>
